<div class="container property-detail-container">
    <div class="row">
        <!-- <div [hidden]="(user.role !== 'admin')" class="col-md-3">
            <div class="nav-side-menu">
                <div class="brand">{{'Property'|translate}}</div>
                <i class="fa fa-bars fa-2x toggle-btn" data-toggle="collapse" data-target="#menu-content"></i>

                <div class="menu-list">

                    <ul id="menu-content" class="menu-content collapse out">
                        <li *ngIf="user.role === 'admin'" class="active">
                            <a [routerLink]="['.']" [queryParams]="{mode:'edit', menuKey:'house-detail'}">
                                <i class="fa fa-bars fa-lg"></i>{{'Property Details Edit'|translate}}
                                <span class="arrow-right"></span>
                            </a>
                        </li>
                        <li class="active">
                            <a [routerLink]="['.']" [queryParams]="{mode:'view', menuKey:'house-detail'}">
                                <i class="fa fa-bars fa-lg"></i>{{'Property Details View'|translate}}
                                <span class="arrow-right"></span>
                            </a>
                        </li>
                        <li data-toggle="collapse" data-target="#how_it_works" class="collapsed active">
                            <a href="javascript:void(0)">
                                <i class="fa fa-bars fa-lg"></i>
                                {{'Property Resources'|translate}}
                                <span class="arrow"></span>
                            </a>

                        </li>
                        <ul class="sub-menu collapse show" id="how_it_works">
                            <li class="active">
                                <a [routerLink]="['.']" [queryParams]="{menuKey:'contract_of_sale'}">{{'Contract of Sale'|translate}}</a>
                            </li>
                            <li class="active">
                                <a [routerLink]="['.']" [queryParams]="{menuKey:'deposit_form'}">{{'Deposit Form'|translate}}</a>
                            </li>
                            <li class="active">
                                <a [routerLink]="['.']" [queryParams]="{menuKey:'solicitor_contract'}">{{'Solicitor Contact'|translate}}</a>
                            </li>
                            <li class="active">
                                <a [routerLink]="['.']" [queryParams]="{menuKey:'bills_charges'}">{{'Bill & Charges'|translate}}</a>
                            </li>
                            <li class="active">
                                <a [routerLink]="['.']" [queryParams]="{menuKey:'management_agreement'}">{{'Management Agreement'|translate}}</a>
                            </li>
                            <li class="active">
                                <a [routerLink]="['.']" [queryParams]="{menuKey:'others'}">{{'Others'|translate}}</a>
                            </li>
                        </ul>
                    </ul>
                </div>
            </div>
        </div> -->

        <div [ngClass]="(user.role === 'admin')?'col-md-12':'col-md-12'" style="background-color: white">
            <!-- <p-button label="{{'Back'|translate}}" (onClick)="goback()" iconPos="left" icon="fa fa-arrow-left"></p-button> -->
            <div [ngSwitch]="menuKey">
                <div *ngSwitchCase="'house-detail'">
                    <div *ngIf="mode===CRUD_MODE.EDIT">
                        <app-property-detail-house-edit [id]="id"></app-property-detail-house-edit>
                    </div>
                    <div *ngIf="mode===CRUD_MODE.CREATE">
                        <app-property-detail-house-edit [id]="0"></app-property-detail-house-edit>
                    </div>
                    <div *ngIf="mode===CRUD_MODE.VIEW">
                        <app-property-detail-house-view [id]="id" [debug]="debug"></app-property-detail-house-view>
                    </div>
                </div>
                <div *ngSwitchDefault>
                    <app-property-detail-resources [id]="id" [menuKey]="menuKey"></app-property-detail-resources>
                </div>
            </div>
        </div>
    </div>
</div>








<p-growl [(value)]="msgs"></p-growl>
<p-confirmDialog header="" [baseZIndex]="10000" icon="pi pi-exclamation-triangle" width="425"></p-confirmDialog>